﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="BreifCVDetail.aspx.cs"
    Inherits="WEB.APP.Modules.List.BreifCVDetail" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>

    <style type="text/css">
        #fsStudentDetail, #fsMain, #plButton
        {
            margin: auto;
        }
    </style>

    <script language="javascript" type="text/javascript">
        function SaveData() {
            var records = grdExpertise.store.data;
            var jsonData = '';
            var _flag = true;
            for (var i = 0; i < records.length; i++) {
                if (i == records.length - 1) {
                    jsonData += Ext.encode(records.items[i].data);
                } else {
                    jsonData += Ext.encode(records.items[i].data) + ',';
                }
                if (records.items[i].data.Checked === true)
                    _flag = false;
            }
            if (_flag) {
                Ext.Msg.alert('Notification', 'Please select at least one Expertise!');
                return;
            }
            if (jsonData != '') {
                jsonData = "[" + jsonData + "]";
            }
            MethodNamespace.SaveData(jsonData, cbStudentID.disabled);
        }

        function AddData() {
            NewData();
            MethodNamespace.LoadExpertiseCv();
            ChangeMode('Add');
        }

        function EditData() {
            if (cbStudentID.getValue()===null || cbStudentID.getValue()==='')
                return;
            MethodNamespace.LoadData();
            MethodNamespace.LoadExpertiseCv();
            ChangeMode('Edit');
        }

        function DeleteData() {
            if (cbStudentID.getValue() === null || cbStudentID.getValue() === '')
                return;
            Ext.Msg.confirm('Delete the data', 'Are you sure you want to remove this data?', function (btn) {
                if (btn==='yes') {
                    MethodNamespace.Delete({
                        success: function () {
                            NewData();
                            ChangeMode('View');
                        }
                    });
                }
            });
        }

        function CancelClick() {
            MethodNamespace.CheckRole();
            if (cbStudentID.disabled)
                MethodNamespace.LoadData();
            else
                NewData();
            ChangeMode('View');
        }

        function SelectStudent(e, record, index) {
            tfStudentName.setValue(record.data.StudentName);
            if (!tbMain.hidden) {
                MethodNamespace.LoadData();
            }
        }

        function NewData() {
            winDetails.reset();
            storeExpertiseCv.removeAll(false);
        }

        function ChangeMode(Mode) {
            switch (Mode) {
                case 'View':
                    tbMain.show();
                    plButton.hide();
                    cbStudentID.setDisabled(false);
                    cgProjectType.setSelectable(false);
                    taComment.setReadOnly(true);
                    rgInterested.setSelectable(false);
                    rgElectiveLeft.setSelectable(false);
                    tfAddSkill.setDisabled(true);
                    grdExpertise.colModel.getColumnById('Checked').editable = false;
                    stStudent.setBaseParam('haveCv', 'true');
                    stStudent.reload(true);
                    return;
                case 'Add':
                    tbMain.hide();
                    plButton.show();
                    cbStudentID.setDisabled(false);
                    cgProjectType.setSelectable(true);
                    taComment.setReadOnly(false);
                    rgInterested.setSelectable(true);
                    rgElectiveLeft.setSelectable(true);
                    tfAddSkill.setDisabled(false);
                    grdExpertise.colModel.getColumnById('Checked').editable = true;
                    stStudent.setBaseParam('haveCv', 'false');
                    stStudent.reload(true);
                    break;
                case 'Edit':
                    tbMain.hide();
                    plButton.show();
                    cbStudentID.setDisabled(true);
                    cgProjectType.setSelectable(true);
                    taComment.setReadOnly(false);
                    rgInterested.setSelectable(true);
                    rgElectiveLeft.setSelectable(true);
                    tfAddSkill.setDisabled(false);
                    grdExpertise.colModel.getColumnById('Checked').editable = true;
                    //stStudent.BaseParams.GetParameter("haveCv").Value = "true";
                    stStudent.reload(true);
                    break;
            }
        }

        var tfAddSkillClick = function(f, parter, index, text, e) {
            if (index===0) {
                if (f.getValue().length > 0) {
                    taOtherSkill.setValue(taOtherSkill.getValue() + taOtherSkill.getValue().split('\n').length + '. ' + f.getValue() + '\n');
                    f.reset();
                    f.focus();
                }
            }
            else if (index===1) {
                taOtherSkill.reset();
            }
        }

        function KeyEnterAdd(f, e) {
            if (e.getKey() === e.ENTER) {
                if (f.getValue().length > 0) {
                    taOtherSkill.setValue(taOtherSkill.getValue() + taOtherSkill.getValue().split('\n').length + '. ' + f.getValue() + '\n');
                    f.reset();
                    f.focus();
                    return false;
                }
            }
            return true;
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <ext:Hidden runat="server" ID="hfIsEdit" />
    <ext:Hidden runat="server" ID="hfIsDelete" />
    <ext:Store ID="storeExpertiseCv" runat="server">
        <Reader>
            <ext:JsonReader IDProperty="ExpertiseId">
                <Fields>
                    <ext:RecordField Name="ExpertiseId" />
                    <ext:RecordField Name="ExpertiseName" />
                    <ext:RecordField Name="Checked" Type="Boolean" />
                </Fields>
            </ext:JsonReader>
        </Reader>
    </ext:Store>
    <ext:Viewport ID="Viewport1" runat="server" Layout="border">
        <Items>
            <ext:FormPanel ID="winDetails" runat="server" TrackMouseOver="true" Border="false"
                Region="Center" Padding="10" MonitorValid="true" AutoScroll="True">
                <TopBar>
                    <ext:Toolbar ID="tbMain" runat="server">
                        <Items>
                            <ext:ToolbarSpacer />
                            <ext:Button ID="btnNew" runat="server" Text="New" Icon="Add">
                                <Listeners>
                                    <Click Fn="AddData" />
                                </Listeners>
                            </ext:Button>
                            <ext:ToolbarSeparator runat="server" ID="tbsAdd" />
                            <ext:Button ID="btnEdit" runat="server" Text="Edit" Icon="Pencil">
                                <Listeners>
                                    <Click Fn="EditData" />
                                </Listeners>
                            </ext:Button>
                            <ext:ToolbarSeparator runat="server" ID="tnsEdit" />
                            <ext:Button ID="btnDelete" runat="server" Text="Delete" Icon="Delete">
                                <Listeners>
                                    <Click Fn="DeleteData" />
                                </Listeners>
                            </ext:Button>
                            <ext:ToolbarSpacer />
                        </Items>
                    </ext:Toolbar>
                </TopBar>
                <Items>
                    <ext:FieldSet runat="server" ID="fsStudentDetail" Layout="FormLayout" Padding="8" Width="600" AutoHeight="true" Margins="auto">
                        <Defaults>
                            <ext:Parameter Name="Anchor" Value="98%" />
                        </Defaults>
                        <Items>
                            <ext:ComboBox ID="cbStudentID" runat="server" DisplayField="StudentId" ValueField="StudentId"
                                TypeAhead="false" ItemSelector="tr.list-item" MinChars="1" Width="150" SelectOnFocus="true"
                                TriggerAction="All" EnableKeyEvents="true" FieldLabel="Student Id">
                                <Store>
                                    <ext:Store ID="stStudent" runat="server" AutoLoad="true">
                                        <Proxy>
                                            <ext:HttpProxy Method="POST" Url="/Modules/List/Search.ashx" DisableCaching="true" AutoDataBind="true" />
                                        </Proxy>
                                        <Reader>
                                            <ext:JsonReader Root="Search" TotalProperty="total" IDProperty="StudentId">
                                                <Fields>
                                                    <ext:RecordField Name="StudentId" />
                                                    <ext:RecordField Name="StudentName" />
                                                    <ext:RecordField Name="BirthDt" Type="Date" />
                                                </Fields>
                                            </ext:JsonReader>
                                        </Reader>
                                        <BaseParams>
                                            <ext:Parameter Name="type" Value="StudentLoadCv" Mode="Value" />
                                        </BaseParams>
                                    </ext:Store>
                                </Store>
                                <Template ID="Template2" runat="server">
                                    <Html>
                                    <tpl for=".">
                                        <tpl if="[xindex] == 1">
                                            <table class="cbStates-list" width="100%">
                                        </tpl>
                                        <tr class="list-item">
                                            <td width="40px" style="padding:3px 0px;">{StudentId}</td>
                                            <td width="40px" style="padding:3px 0px;">{StudentName}</td>
                                        </tr>
                                        <tpl if="[xcount-xindex]==0"> 
                                            </table>
                                        </tpl>
                                    </tpl>
                                    </Html>
                                </Template>
                                <Listeners>
                                    <Select Fn="SelectStudent" />
                                </Listeners> 
                            </ext:ComboBox>
                            <ext:TextField runat="server" ID="tfStudentName" FieldLabel="Student Name" Disabled="true" />
                            <%--<ext:TextField runat="server" ID="tfBirthDt" FieldLabel="Birth Dt" Disabled="true" />--%>
                        </Items>
                    </ext:FieldSet>
                    <ext:FieldSet runat="server" ID="fsMain" Layout="FormLayout" Padding="8" Width="600" LabelWidth="30"
                        AutoHeight="true" Margins="Auto">
                        <Defaults>
                            <ext:Parameter Name="Anchor" Value="98%" />
                        </Defaults>
                        <Items>
                            <%--<ext:Panel runat="server" BodyStyle="background-color:transparent;" Layout="ColumnLayout"
                                Border="False" Height="335" Split="true">
                                <Items>
                                    <ext:Panel runat="server" ColumnWidth="0.75" BodyStyle="background-color:transparent;"
                                        Layout="FormLayout" Border="False">
                                        <Defaults>
                                            <ext:Parameter Name="Anchor" Value="90%" />
                                        </Defaults>
                                        <Items>--%>
                                            <ext:DisplayField runat="server" HideLabel="true" AutoHeight="true" Text="Upon the completion of Professional Experience unit, would you be interested to take the follow-on Computing Projects unit?" />
                                            <ext:RadioGroup ID="rgElectiveLeft" runat="server" ItemCls="x-check-group-base" AllowBlank="false"
                                                ColumnsNumber="1">
                                                <Items>
                                                    <ext:Radio ID="rgElectiveLeftR1" runat="server" BoxLabel="Yes and has an elective left" />
                                                    <ext:Radio ID="rgElectiveLeftR2" runat="server" BoxLabel="Yes, but no elective left" />
                                                    <ext:Radio ID="rgElectiveLeftR3" runat="server" BoxLabel="No" />
                                                </Items>
                                            </ext:RadioGroup>
                                            <ext:DisplayField runat="server" HideLabel="true" AutoHeight="true" Text="Please select interested." />
                                            <ext:CheckboxGroup ID="cgProjectType" runat="server" ItemCls="x-check-group-base" AllowBlank="false"
                                                ColumnsNumber="2">
                                                <Items>
                                                    <ext:Checkbox ID="cgProjectTypeR1" runat="server" BoxLabel="Database Design and Development" />
                                                    <ext:Checkbox ID="cgProjectTypeR2" runat="server" BoxLabel="Software Development" />
                                                    <ext:Checkbox ID="cgProjectTypeR3" runat="server" BoxLabel="Mobile Application" />
                                                    <ext:Checkbox ID="cgProjectTypeR4" runat="server" BoxLabel="Web Application" />
                                                    <ext:Checkbox ID="cgProjectTypeR5" runat="server" BoxLabel="Systems Analysis and Design" />
                                                    <ext:Checkbox ID="cgProjectTypeR6" runat="server" BoxLabel="Website Design and Development" />
                                                    <ext:Checkbox ID="cgProjectTypeR7" runat="server" BoxLabel="Systems Administration" />
                                                    <ext:Checkbox ID="cgProjectTypeR8" runat="server" BoxLabel="Operating System Development" />
                                                    <ext:Checkbox ID="cgProjectTypeR9" runat="server" BoxLabel="Web Systems development" />
                                                </Items>
                                            </ext:CheckboxGroup>
                                            <ext:DisplayField runat="server" HideLabel="true" AutoHeight="true" Text="Will you be interested to get involved in a challenging project, which may involve learning new technologies (may not be listed above)?" />
                                            <ext:RadioGroup ID="rgInterested" runat="server" ItemCls="x-check-group-base" AllowBlank="false">
                                                <Items>
                                                    <ext:Radio ID="InterestedR1" runat="server" BoxLabel="Yes" />
                                                    <ext:Radio ID="InterestedR2" runat="server" BoxLabel="No" />
                                                </Items>
                                            </ext:RadioGroup>
                                        <%--</Items>
                                    </ext:Panel>
                                    <ext:Panel ID="Panel1" runat="server" ColumnWidth="0.25" BodyStyle="background-color:transparent;border-color: #CCC;"
                                        Layout="FormLayout" Border="False">
                                        <Defaults>
                                            <ext:Parameter Name="Anchor" Value="100%" />
                                        </Defaults>
                                        <Items>--%>
                                            <ext:DisplayField ID="DisplayField3" runat="server" HideLabel="true" AutoHeight="true"
                                                Text="Please select (multiple) of your technology" />
                                            <ext:CompositeField runat="server">
                                                <Items>
                                                    <ext:GridPanel ID="grdExpertise" runat="server" Width="515" StoreID="storeExpertiseCv" Height="172"
                                                        AutoExpandColumn="ExpertiseName" DisableSelection="True" EnableColumnHide="False" EnableColumnMove="False" EnableColumnResize="False" HideHeaders="True">
                                                        <ColumnModel ID="ColumnModel1" runat="server">
                                                            <Columns>
                                                                <ext:Column ColumnID="ExpertiseName" DataIndex="ExpertiseName" Header="ExpertiseName" />
                                                                <ext:CheckColumn Editable="true" ColumnID="Checked" DataIndex="Checked" Align="Center" Width="30" />
                                                            </Columns>
                                                        </ColumnModel>
                                                    </ext:GridPanel>
                                                </Items>
                                            </ext:CompositeField>
                                            <ext:DisplayField ID="DisplayField2" runat="server" HideLabel="true" AutoHeight="true"
                                                Text="Orther skill (not required)" />
                                            <ext:TriggerField  ID="tfAddSkill" runat="server">
                                                <Triggers>
                                                    <ext:FieldTrigger Icon="SimplePlus" Qtip="Add skill" />
                                                    <ext:FieldTrigger Icon="SimpleError" Qtip="Clear all skill" />
                                                </Triggers>
                                                <Listeners>
                                                    <SpecialKey Fn="KeyEnterAdd" />
                                                    <TriggerClick Fn="tfAddSkillClick" />
                                                </Listeners>
                                            </ext:TriggerField >
                                            <ext:TextArea ID="taOtherSkill" runat="server" ReadOnly="true" />
                                            <ext:DisplayField ID="DisplayField1" runat="server" HideLabel="true" AutoHeight="true"
                                                Text="Comment (not required)" />
                                            <ext:TextArea ID="taComment" runat="server" Height="86" />
                                        <%--</Items>
                                    </ext:Panel>
                                </Items>
                            </ext:Panel>--%>
                        </Items>
                    </ext:FieldSet>
                    <ext:Panel ID="plButton" runat="server" Width="600" Border="false" LabelWidth="30" Layout="HBoxLayout" Margins="Auto">
                        <LayoutConfig>
                            <ext:HBoxLayoutConfig Align="Middle" Pack="Center" />
                        </LayoutConfig>
                        <Items>
                            <ext:Button ID="btnSave" runat="server" Text="Save" Icon="Disk" Margins="0 10">
                                <Listeners>
                                    <Click fn="SaveData" />
                                </Listeners>
                            </ext:Button>
                            <ext:Button ID="btnCancel" runat="server" Text="Cancel" Icon="Cancel" Margins="0 10">
                                <Listeners>
                                    <Click Fn="CancelClick" />
                                </Listeners>
                            </ext:Button>
                        </Items>
                    </ext:Panel>
                </Items>
                <Listeners>
                    <ClientValidation Handler="#{btnSave}.setDisabled(!valid);" />
                </Listeners>
            </ext:FormPanel>
        </Items>
    </ext:Viewport>
    </form>
</body>
</html>
